<template>
  <div class="ca">
    <img :src="src" alt />
    <div @click="postImg">
      <p>看不清</p>
      <p>换一张</p>
    </div>
  </div>
</template>

<script>
export default {
  components: {},
  data() {
    return {
      src: null
    }
  },
  methods: {
    postImg() {
      this.$http.post('v1/captchas').then(data => {
        this.src = data.body.code
      })
    }
  },
  created() {
    this.postImg()
  }
}
</script>
<style  scoped>
.ca {
  display: flex;
}
p {
  margin: 0;
  font-size: 0.5rem;
  color: #26a2ff;
}
img {
  height: 40px;
  flex: 1;
}
.ca > div {
  margin-right: 5vw;
}
.tx {
  padding-top: 5vw;
  padding-left: 5vw;
}
.tx > p {
  color: red;
}
</style>
